<template>
  <div>
    <r-search :searchForm="searchForm" :searchHandle="searchHandle" :searchData="searchData" />
    <r-search :searchHandle="searchHandleAdd" />
    <r-table :tableHandles="tableHandles" :isSelection="false" :isIndex="false" :isPagination="true"
      :tableData="tableData" :tableCols="tableCols" :tablePage="tablePage" :isHandle="true" @refresh="init()">
    </r-table>
    <!--    <r-form :formRules="formRules" :formHandle="formHandle" :formData="formData" :formCols="formCols" ref="elForm" labelWidth="200px" dialogWidth="1000px" :isHandle="true" />-->
  </div>
</template>
<script>
  export default {
    data() {
      return {
        // 模板导出数据
        searchHandleAdd: [
          {
            label: "导出数据",
            icon: 'el-icon-download',
            type: "success",
            loading: false,
            // handle: (that) => this.handleDownload(),
            handle: async (e) => {

              const res = await this.apis.deviceLogExport();
              // console.log("res---", res.msg);
              location.href = process.env.VUE_APP_URL + '/profile/download' + res.msg;
            }
          },
        ],
        searchData: {
          deviceType: '3',
          deviceNo: '',
          oprType: '',
          result: '',
          phone: '',
          orderNo: ''
        },
        searchForm: [

          {
            type: 'input',
            prop: 'deviceNo',
            placeholder: '设备编号',
            width: 150
          },
          {
            type: 'select',
            prop: 'oprType',
            placeholder: '操作类型',
            width: 150,
            options: [{ label: '开门充电', value: '1' }, { label: '开门取电', value: '2' }]
          },
          {
            type: 'select',
            prop: 'result',
            placeholder: '操作状态',
            width: 150,
            options: [{ label: '失败', value: '0' }, { label: '成功', value: '1' }]
          },
          {
            type: 'input',
            prop: 'phone',
            placeholder: '手机号',
            width: 150
          },
          // {
          //   type: 'input',
          //   prop: 'name',
          //   placeholder: '充取状态',
          //   width: 150
          // },
          {
            type: 'input',
            prop: 'orderNo',
            placeholder: '订单编号',
            width: 150
          }
        ],
        searchHandle: [
          {
            label: '搜索',
            type: 'success',
            icon: 'el-icon-search',
            handle: e => this.init()
          }
        ],

        tableHandles: [
          // {
          //   label: "导出数据",
          //   type: "primary",
          //   handle: e => this.elFormVisible()
          // }
        ],
        tableData: [],
        tableCols: [
          {
            label: "设备编号",
            prop: "deviceNo",
          },

          {
            label: '柜门号',
            prop: 'cabinetNo'
          },
          // 操作类型：0：管理员（运维）开门 1：开门充电（充电柜）  2：开门取电(充电柜） 3：开门取电池(换电柜）4：开门换电池（换电柜） 5：开门归还电池（换电柜）
          {
            label: '操作类型',
            prop: 'oprType',
            formatter: e => (e.oprType == 0 ? '管理员（运维）开门' : e.oprType == 1 ? '开门充电' : e.oprType == 2 ? '开门取电' : '--')
          },
          // 结果: 0 失败 1成功
          {
            label: '操作状态',
            prop: 'result',
            itemClass: e => (e.result == 0 ? 'danger' : e.result == 1 ? 'success' : ''),
            formatter: e => (e.result == 0 ? '失败' : e.result == 1 ? '成功' : '--')
          },
          {
            label: '操作人',
            prop: 'userName'
          },
          // {
          //   label: '充/取状态',
          //   prop: 'giftMoney'
          // },
          {
            label: '开始时间',
            prop: 'ctime'
          },
          {
            label: '结束时间',
            prop: 'ftime'
          },
          {
            label: '对应订单',
            prop: 'orderNo'
          }
        ],
        tablePage: { limit: 10, page: 1, total: 0 }
        // formData: {
        //   name: "",
        //   money: "",
        //   giftMoney: "",
        //   status: ""
        // },
        // formCols: [
        //   { type: "input", label: "套餐名称", width: 350, prop: "name" },
        //   { type: "input", label: "套餐金额", width: 350, prop: "money", remark: '元' },
        //   { type: "input", label: "赠送金额", width: 350, prop: "giftMoney", remark: '元' },
        //   { type: "switch", label: "上线/下线", width: 350, prop: "status" },
        // ],
        // formRules: {
        //   name: [
        //     { required: true, message: '请输入套餐名称', trigger: 'blur' },
        //   ],
        //   money: [
        //     { required: true, message: '请输入套餐金额', trigger: 'blur' },
        //   ],
        //   giftMoney: [
        //     { required: true, message: '请输入套餐金额', trigger: 'blur' },
        //   ],
        // },
        // formHandle: [
        //   {
        //     label: "取消",
        //     handle: e => this.elFormVisible(),
        //   },
        //   {
        //     label: "确定",
        //     type: "success",
        //     handle: e => this.elFormSubmit(),
        //   },
        //
        // ],
      }
    },
    components: {},
    computed: {},
    mounted() {
      console.log(444, this.$route.query);
      if (this.$route.query.deviceNo) {
        this.searchData.deviceNo = this.$route.query.deviceNo
      }
      this.init()
    },
    methods: {
      async init() {
        let parm = {
          ...this.searchData,
          ...{
            pageNum: this.tablePage.page,
            pageSize: this.tablePage.limit
          }
        }
        let res = await this.apis.deviceLog_list(parm)
        if (res) {
          this.tableData = res.rows || []
          this.tablePage.total = res.total
        }
      }
      // async elFormSubmit() {
      //   this.formData.state = this.formData.status == true ? 1 : 2
      //   if (this.formData.id) {
      //     let res = await this.api.packupdate(this.formData)
      //     if (res) {
      //       this.formData.id = ''
      //       this.elFormVisible()
      //       this.init()
      //     }
      //   } else {
      //     let res = await this.api.packadd(this.formData)
      //     if (res) {
      //       this.elFormVisible()
      //       this.init()
      //     }
      //   }
      // },
      // async changestate(id) {
      //   let res = await this.api.packchange({ id })
      //   if (res) {
      //     this.init()
      //   }
      // },
      // elFormDetail(row) {
      //   console.log(row);
      //   Object.keys(this.formData).forEach(key => {
      //     this.formData[key] = row[key]
      //   })
      //
      //   this.formData.status=row['state']==1?true:false
      //   this.formData.id = row.id;
      //   // if (this.formCols[1].label == '登录密码') {
      //   //     this.formCols.splice(1, 1)
      //   // }
      //
      //   this.elFormVisible()
      // },
    }
  }
</script>
<style scoped lang="scss">
  .el-icon-search {
    margin-right: 10px;
  }

  .Tip {
    margin-left: 20px;
  }
</style>